<template>
  <div class="main">
    <section>
      <search-form :listQuery="listQuery" :queryConfig="queryConfig" :labelWidth="100" :search="fetchData"/>
      <el-table v-loading="listLoading" :data="list" element-loading-text="给我一点时间" border fit highlight-current-row>
        <el-table-column align="center" label="序号" type="index" fixed :index="(index)=>{return indexMethod(index, listQuery)}" width="80">
        </el-table-column>
        <el-table-column align="center" label="信息类型" prop="msgType" width="130">
          <template slot-scope="scope">
            {{scope.row.msgType | filterMsg }}
          </template>
        </el-table-column>
        <el-table-column align="center" label="通知信息" prop="msgContent" min-width="160">
        </el-table-column>
        <el-table-column align="center" label="通知时间" prop="notificationTime" width="160">
          <template slot-scope="scope">
            <span>{{scope.row.notificationTime}}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="合同签约方" prop="contractingPartyName" min-width="160">
        </el-table-column>
        <el-table-column align="center" label="备注" prop="remark" min-width="160">
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="listQuery.pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="listQuery.pageSize"
        background
        layout="total, sizes, prev, pager, next, jumper"
        :total="listTotal"
      >
      </el-pagination>
    </section>
  </div>
</template>
<script>
import searchForm from '@/components/searchForm/index'
export default {
  name: 'appConfig',
  components: {
    searchForm
  },
  data(){
    const errArr = [
      {value: 'ERROR_MSG', label: '错误信息'},
      {value: 'UPDATE_MSG', label: '变更信息'},
      {value: 'WARNING_MSG', label: '预警信息信息'}
    ]
    return {
      listTotal: 0,
      listQuery: {
        contractingPartyName: '',
        startTime: '',
        endTime: '',
        msgType: '',
        pageNum: 1,
        pageSize: 10,
        tempCreateDate: []
      },
      queryConfig: [
        { type: 'input', label: '合同签约方', prop: 'contractingPartyName', maxlength: '100' },
        { type: 'select', label: '信息类型', prop: 'msgType', data: errArr}, // ERROR_MSG：错误信息 UPDATE_MSG：变更信息 WARNING_MSG：预警信息信息
        { prop: 'tempCreateDate', type: 'daterange', label: '通知时间' },
      ],
      listLoading: true,
      // listTotal: 0,
      list: [],

      lastPushData: {}
    }
  },
  created(){
    this.fetchData()
    this.fetchTypeData()
    this.fetchPushData()
  },
  methods: {
    fetchData(){
      this.listLoading = true
      const dataParams = {
        contractingPartyName: this.listQuery.contractingPartyName,
        startTime: this.listQuery.tempCreateDate && this.listQuery.tempCreateDate.length === 2 ? this.listQuery.tempCreateDate[0] : '',
        endTime: this.listQuery.tempCreateDate && this.listQuery.tempCreateDate.length === 2 ? this.listQuery.tempCreateDate[1] : '',
        msgType: this.listQuery.msgType,
        pageNum:this.listQuery.pageNum,
        pageSize:this.listQuery.pageSize,
      }
      this.request({
        url: '/invoice-web-manage/invoice/msg-notice/search',
        method: 'post',
        data: dataParams
      }).then(({data}) => {

        this.list = data.list;
        this.listTotal = data.total;
        this.listLoading = false;
      }).catch(err => {
        console.log(err);
        this.list = [];
        // this.listTotal = 0;
        this.listLoading = false;
      });
    },
    fetchTypeData(){
      this.request({
        url: '/acm/client-properties-type/list',
        method: 'get'
      }).then(({data}) => {
        this.queryConfig[0].data = data.map(i => {
          return {
            label: i.typeName,
            value: i.typeKey
          }
        });
        this.queryConfig[0].data = [{ label: '全部', value:'' }].concat(this.queryConfig[0].data)
      }).catch(err => {
        console.log(err);
      });
    },
    fetchPushData(){
      this.request({
        url: '/acm/acm-publish-record/last',
        method: 'get'
      }).then(({data}) => {
        this.lastPushData = data
      }).catch(err => {
        console.log(err);
      });
    },
    // 切换分页
    handleCurrentChange(page) {
      this.listQuery.pageNum = page
      this.getList()
    },
    // 切换分页数
    handleSizeChange(pageSize) {
      this.listQuery.pageSize = pageSize
      this.getList()
    }
  },
  filters: {
    filterMsg(val) {
      const errArr = [
        {value: 'ERROR_MSG', label: '错误信息'},
        {value: 'UPDATE_MSG', label: '变更信息'},
        {value: 'WARNING_MSG', label: '预警信息信息'}
      ]
      const index = errArr.findIndex(i => i.value === val)
      if (index > -1) {
        return errArr[index].label
      }
      return ''
    }
  }
}
</script>
<style lang="scss" scoped>
.btn-block{
  .push-item{
    color: #999;
    font-size: 14px;
    display: inline-block;
    margin-left: 50px;

    span{
      color: #333;
      font-size: 15px;
    }
  }
}
</style>
